<!DOCTYPE html>
<html lang="zh-cn" class="h-100">
<head>
    <meta charset="utf-8">
    <meta name="viewport"content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
    <title>index</title>
    <!-- Bootstrap 的 CSS 文件 必须在最前面-->
    <link rel="stylesheet" href="../static/assets/dist/css/bootstrap.min.css">
    <!-- jQuery 和 Bootstrap 集成包（集成了 Popper） -->
    <script src="../static/assets/dist/js/jquery-3.5.1.min.js"></script>
    <script src="../static/assets/dist/js/bootstrap.bundle.min.js"></script>
    <script src="../static/js/index.js"></script>
    <style>
        #register{
            margin-right: 10px;
        }

        .container {
            width: auto;
            max-width: 680px;
            padding: 0 15px;
        }

        .footer {
            background-color: #f5f5f5;
        }

    </style>
</head>
<body class="d-flex flex-column h-100">
<header>
    <nav class="navbar navbar-expand-md navbar-dark bg-dark">
        <a class="navbar-brand" href="/">Haochen233</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                    <a class="nav-link" href="javascript:void(0)">Link1</a>
                </li>
                <li class="nav-item dropdown">
                    <a class="nav-link dropdown-toggle" href="javascript:void(0)" id="navbarDropdown" data-toggle="dropdown" role="buttond">Link2</a>
                    <div class="dropdown-menu">
                        <a class="dropdown-item" href="javascript:void(0)">One</a>
                        <a class="dropdown-item" href="javascript:void(0)">Two</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="javascript:void(0)">Three</a>
                    </div>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0)">Link3</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link disabled" href="javascript:void(0)">Link4</a>
                </li>
            </ul>
            <form class="form-inline my-2 my-lg-0" id="auth" hidden>
                <a id="register" class="btn btn-light" href="/account/register">注册</a>
                <a id="login" class="btn btn-light" href="/account/login">登录</a>
            </form>
        </div>
    </nav>
</header>

<footer class="footer mt-auto py-3">
    <div class="container">
        <span class="text-muted">Place sticky footer content here.</span>
    </div>
</footer>
</body>
</html>
